import React from 'react'

export default class Col extends React.Component{


    coordinates(col,row){
        console.log(col)
        this.props.coord2(col,row)

    }
    render() {
        const {col,row,data} = this.props;
        // console.log(data)
        const colStyle = {}
        const rowStyle = {}
        //判断表格的位置 渲染指定的样式
        //最左侧
        if(col===0){
            colStyle.left = "50%";
            colStyle.width = "50%"
            //最右侧
        }else if(col===14){
            colStyle.width = "50%"
        }
        //最上侧
        if(row===0){
            rowStyle.top = "50%";
            rowStyle.height = "50%"
            //最下侧
        }else if(row===14){
            rowStyle.height = "50%"
        }

        // console.log(colStyle)
        return (
            <div className="cell" >
                <div className="on-cell" onClick={this.coordinates.bind(this,col,row)}>
                    <div className="closs" style={colStyle}></div>
                    <div className="column" style={rowStyle}></div>
                    {   //data为1，渲染白棋

                        data === 1 && <div className="mmmm p1" ></div>
                    }
                    {
                        //data为2，渲染黑棋
                        data === 2 && <div className="mmmm p2"></div>
                    }

                </div>

            </div>
        )
    }
}